﻿<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<html class="no-js" lang="">

<head>
    <!-- Meta Data -->
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Cirkle | Single Shop</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- Favicon -->
    <link rel="shortcut icon" type="image/x-icon" href="${pageContext.request.contextPath}/static/media/favicon.png">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/dependencies/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/dependencies/icofont/icofont.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/dependencies/slick-carousel/css/slick.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/dependencies/slick-carousel/css/slick-theme.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/dependencies/magnific-popup/css/magnific-popup.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/dependencies/sal.js/sal.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/dependencies/mcustomscrollbar/jquery.mCustomScrollbar.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/dependencies/select2/css/select2.min.css">

    <!-- Site Stylesheet -->
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/assets/css/app.css">
    <!-- Google Web Fonts -->
    <link href="https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,300;0,400;0,600;0,700;0,800;0,900;1,400&display=swap" rel="stylesheet">
    <style>
        .tuipian{
            width: 250px;
            height: 250px;
        }

    </style>
</head>

<body class="bg-link-water">
<form action="${pageContext.request.contextPath}/addGouWu?sid=${s.sid}" method="post">
<!--[if lte IE 9]>
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="https://browsehappy.com/">upgrade your browser</a> to improve your experience and security.</p>
<![endif]-->
<a href="#wrapper" data-type="section-switch" class="scrollup">
    <i class="icofont-bubble-up"></i>
</a>
<!-- Preloader Start Here -->
<div id="preloader"></div>
<!-- Preloader End Here -->
<div id="wrapper" class="wrapper">
    <!-- Top Header -->
    <%@include file="top.jsp" %>
    <!-- Sidebar Left -->
    <div class="fixed-sidebar">
        <div class="fixed-sidebar-left small-sidebar">
            <div class="sidebar-toggle">
                <button class="toggle-btn toggler-open">
                    <span></span>
                    <span></span>
                    <span></span>
                </button>
            </div>
            <div class="sidebar-menu-wrap">
                <div class="mCustomScrollbar" data-mcs-theme="dark" data-mcs-axis="y">
                    <ul class="side-menu">
                        <li><a href="${pageContext.request.contextPath}/Directory/newsfeed" class="menu-link" data-toggle="tooltip" data-placement="right" title=" NEWSFEED"><i class="icofont-newspaper"></i></a></li>
                        <li><a href="${pageContext.request.contextPath}/Directory/user-timeline" class="menu-link" data-toggle="tooltip" data-placement="right" title="MEMBERS TIMELINE"><i class="icofont-list"></i></a></li>
                        <li><a href="${pageContext.request.contextPath}/Directory/user-groups" class="menu-link" data-toggle="tooltip" data-placement="right" title="GROUPS"><i class="icofont-users-alt-2"></i></a></li>
                        <li><a href="${pageContext.request.contextPath}/Directory/user-friends" class="menu-link" data-toggle="tooltip" data-placement="right" title="MEMBERS FRIENDS"><i class="icofont-users-alt-4"></i></a></li>
                        <li><a href="${pageContext.request.contextPath}/Directory/user-photo" class="menu-link" data-toggle="tooltip" data-placement="right" title="GALLERY"><i class="icofont-photobucket"></i></a></li>
                        <li><a href="${pageContext.request.contextPath}/Directory/user-video" class="menu-link" data-toggle="tooltip" data-placement="right" title="VIDEOS"><i class="icofont-play-alt-1"></i></a></li>
                        <li><a href="#" class="menu-link" data-toggle="tooltip" data-placement="right" title="EVENT SCHEDULE"><i class="icofont-calendar"></i></a></li>
                        <li><a href="${pageContext.request.contextPath}/Directory/forums-timeline" class="menu-link" data-toggle="tooltip" data-placement="right" title="FORUM"><i class="icofont-ui-text-chat"></i></a></li>
                        <li><a href="${pageContext.request.contextPath}/Directory/shop" class="menu-link" data-toggle="tooltip" data-placement="right" title="SHOP"><i class="icofont-shopping-cart"></i></a></li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="fixed-sidebar-left large-sidebar">
            <div class="sidebar-toggle">
                <div class="sidebar-logo">
                    <a href="${pageContext.request.contextPath}/Directory/index"><img src="${pageContext.request.contextPath}/static/media/logo2.png" alt="Logo"></a>
                </div>
                <button class="toggle-btn toggler-close">
                    <span></span>
                    <span></span>
                    <span></span>
                </button>
            </div>
            <div class="sidebar-menu-wrap">
                <div class="mCustomScrollbar" data-mcs-theme="dark" data-mcs-axis="y">
                    <ul class="side-menu">
                        <li><a href="${pageContext.request.contextPath}/Directory/newsfeed" class="menu-link"><i class="icofont-newspaper"></i><span class="menu-title">Newsfeed</span></a></li>
                        <li><a href="${pageContext.request.contextPath}/Directory/user-timeline" class="menu-link"><i class="icofont-list"></i><span class="menu-title">Members Timeline</span></a></li>
                        <li><a href="${pageContext.request.contextPath}/Directory/user-groups" class="menu-link"><i class="icofont-users-alt-2"></i><span class="menu-title">Groups</span></a></li>
                        <li><a href="${pageContext.request.contextPath}/Directory/user-friends" class="menu-link"><i class="icofont-users-alt-4"></i><span class="menu-title">Members Friends</span></a></li>
                        <li><a href="${pageContext.request.contextPath}/Directory/user-photo" class="menu-link"><i class="icofont-photobucket"></i><span class="menu-title">Gallery</span></a></li>
                        <li><a href="${pageContext.request.contextPath}/Directory/user-video" class="menu-link"><i class="icofont-play-alt-1"></i><span class="menu-title">Videos</span></a></li>
                        <li><a href="#" class="menu-link"><i class="icofont-calendar"></i><span class="menu-title">Event Schedule</span></a></li>
                        <li><a href="${pageContext.request.contextPath}/Directory/forums-timeline" class="menu-link"><i class="icofont-ui-text-chat"></i><span class="menu-title">Forum</span></a></li>
                        <li><a href="${pageContext.request.contextPath}/Directory/shop" class="menu-link"><i class="icofont-shopping-cart"></i><span class="menu-title">Shop</span></a></li>
                    </ul>
                    <ul class="top-menu-mobile">
                        <li class="menu-label">Community</li>
                        <li>
                            <a href="${pageContext.request.contextPath}/Directory/user-about" class="menu-link">Profile About</a>
                        </li>
                        <li>
                            <a href="${pageContext.request.contextPath}/Directory/user-badges" class="menu-link">Profile Badges</a>
                        </li>
                        <li>
                            <a href="${pageContext.request.contextPath}/Directory/forums" class="menu-link">Forums</a>
                        </li>
                        <li>
                            <a href="${pageContext.request.contextPath}/Directory/forums-forum" class="menu-link">Forums Topic</a>
                        </li>
                        <li>
                            <a href="${pageContext.request.contextPath}/Directory/forums-info" class="menu-link">Forums Info</a>
                        </li>
                        <li>
                            <a href="${pageContext.request.contextPath}/Directory/forums-members" class="menu-link">Forums Members</a>
                        </li>
                        <li>
                            <a href="${pageContext.request.contextPath}/Directory/forums-media" class="menu-link">Forums Media</a>
                        </li>
                        <li class="menu-label">Pages</li>
                        <li>
                            <a href="${pageContext.request.contextPath}/Directory/about-us" class="menu-link">About</a>
                        </li>
                        <li>
                            <a href="${pageContext.request.contextPath}/Directory/user-blog" class="menu-link">Blog</a>
                        </li>
                        <li>
                            <a href="${pageContext.request.contextPath}/Directory/shop" class="menu-link">Shop</a>
                        </li>
                        <li>
                            <a href="${pageContext.request.contextPath}/Directory/single-blog" class="menu-link">Blog Details</a>
                        </li>
                        <li>
                            <a href="${pageContext.request.contextPath}/Directory/single-shop
" class="menu-link">Shop Details</a>
                        </li>
                        <li>
                            <a href="${pageContext.request.contextPath}/Directory/contact" class="menu-link">Contact Us</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <!-- Sidebar Right -->
    <div class="fixed-sidebar right">
        <div class="fixed-sidebar-right small-sidebar">
            <div class="sidebar-toggle" id="chat-head-toggle">
                <button class="chat-icon">
                    <i class="icofont-speech-comments"></i>
                </button>
            </div>
            <div class="sidebar-menu-wrap">
                <div class="mCustomScrollbar" data-mcs-theme="dark" data-mcs-axis="y">
                    <ul class="user-chat-list">
                        <li class="chat-item chat-open">
                            <div class="author-img">
                                <img src="${pageContext.request.contextPath}/static/media/figure/chat_1.jpg" alt="chat">
                                <span class="chat-status offline"></span>
                            </div>
                        </li>
                        <li class="chat-item chat-open">
                            <div class="author-img">
                                <img src="${pageContext.request.contextPath}/static/media/figure/chat_2.jpg" alt="chat">
                                <span class="chat-status offline"></span>
                            </div>
                        </li>
                        <li class="chat-item chat-open">
                            <div class="author-img">
                                <img src="${pageContext.request.contextPath}/static/media/figure/chat_3.jpg" alt="chat">
                                <span class="chat-status offline"></span>
                            </div>
                        </li>
                        <li class="chat-item chat-open">
                            <div class="author-img">
                                <img src="${pageContext.request.contextPath}/static/media/figure/chat_4.jpg" alt="chat">
                                <span class="chat-status online"></span>
                            </div>
                        </li>
                        <li class="chat-item chat-open">
                            <div class="author-img">
                                <img src="${pageContext.request.contextPath}/static/media/figure/chat_5.jpg" alt="chat">
                                <span class="chat-status online"></span>
                            </div>
                        </li>
                        <li class="chat-item chat-open">
                            <div class="author-img">
                                <img src="${pageContext.request.contextPath}/static/media/figure/chat_6.jpg" alt="chat">
                                <span class="chat-status online"></span>
                            </div>
                        </li>
                        <li class="chat-item chat-open">
                            <div class="author-img">
                                <img src="${pageContext.request.contextPath}/static/media/figure/chat_7.jpg" alt="chat">
                                <span class="chat-status offline"></span>
                            </div>
                        </li>
                        <li class="chat-item chat-open">
                            <div class="author-img">
                                <img src="${pageContext.request.contextPath}/static/media/figure/chat_8.jpg" alt="chat">
                                <span class="chat-status offline"></span>
                            </div>
                        </li>
                        <li class="chat-item chat-open">
                            <div class="author-img">
                                <img src="${pageContext.request.contextPath}/static/media/figure/chat_9.jpg" alt="chat">
                                <span class="chat-status offline"></span>
                            </div>
                        </li>
                        <li class="chat-item chat-open">
                            <div class="author-img">
                                <img src="${pageContext.request.contextPath}/static/media/figure/chat_10.jpg" alt="chat">
                                <span class="chat-status offline"></span>
                            </div>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <!-- Page Content -->
    <div class="page-content">

        <!--=====================================-->
        <!--=        Newsfeed  Area Start       =-->
        <!--=====================================-->
        <div class="container">
            <div class="product-breadcrumb block-box">
                <div class="breadcrumb-area">
                    <h1 class="item-title">Shop Page</h1>
                    <ul>
                        <li>
                            <a href="${pageContext.request.contextPath}/Directory/index">Home</a>
                        </li>
                        <li>
                            <a href="${pageContext.request.contextPath}/Directory/shop">Shop</a>
                        </li>
                        <li>Black Coffee Mug</li>
                    </ul>
                </div>
            </div>
            <div class="single-product">


                <div class="row">

                    <div class="col-lg-6">
                        <div class="product-gallery">
                            <div class="tab-content">
                                <div role="tabpanel" class="tab-pane fade active show" id="related1">
                                    <a href="#">
                                        <img class="zoom_01 img-fluid" alt="single" src="${pageContext.request.contextPath}/static/img/${s.simg}" data-zoom-image="media/figure/product_10.jpg">
                                    </a>
                                </div>
                                <div role="tabpanel" class="tab-pane fade" id="related2">
                                    <a href="#">
                                        <img class="zoom_01 img-fluid" alt="single" src="${pageContext.request.contextPath}/static/img/${s.simg}" data-zoom-image="media/figure/product_10.jpg">
                                    </a>
                                </div>
                                <div role="tabpanel" class="tab-pane fade" id="related3">
                                    <a href="#">
                                        <img class="zoom_01 img-fluid" alt="single" src="${pageContext.request.contextPath}/static/img/${s.simg}" data-zoom-image="media/figure/product_10.jpg">
                                    </a>
                                </div>
                                <div role="tabpanel" class="tab-pane fade" id="related4">
                                    <a href="#">
                                        <img class="zoom_01 img-fluid" alt="single" src="${pageContext.request.contextPath}/static/img/${s.simg}" data-zoom-image="media/figure/product_10.jpg">
                                    </a>
                                </div>
                            </div>
                            <ul class="nav nav-tabs tab-nav-list">
                                <li class="nav-item">
                                    <a class="active" href="#related1" data-toggle="tab" aria-expanded="false">
                                        <img alt="related1" src="${pageContext.request.contextPath}/static/img/${s.simg}" class="img-fluid">
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a href="#related2" data-toggle="tab" aria-expanded="false">
                                        <img alt="related2" src="${pageContext.request.contextPath}/static/img/${s.simg}" class="img-fluid">
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a href="#related3" data-toggle="tab" aria-expanded="false">
                                        <img alt="related3" src="${pageContext.request.contextPath}/static/img/${s.simg}" class="img-fluid">
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a href="#related4" data-toggle="tab" aria-expanded="false">
                                        <img alt="related3" src="${pageContext.request.contextPath}/static/img/${s.simg}" class="img-fluid">
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </div>

                    <div class="col-lg-6">
                        <div class="product-content">
                            <div class="item-category">BAG</div>
                            <h2 class="item-title">${s.stitle}</h2>
                            <div class="item-price">$${s.sprice}</div>
                            <ul class="entry-meta">
                                <li>SKU:
                                    <span>${s.snum}</span>
                                </li>
                                <li>Tags:
                                    <a href="#">Bag,</a>
                                    <a href="#">Leather</a>
                                </li>
                            </ul>
                            <p>${s.sdetails}</p>
                            <ul class="action-area">
                                <li id="quantity-holder">
                                    <div class="input-group quantity-holder">
                                        <button class="quantity-btn quantity-plus" type="button">
                                            <i class="icofont-plus" aria-hidden="true"></i>
                                        </button>
                                        <input type="text" name="pnum" id="pnum" class="form-control quantity-input" value="1" placeholder="1">
                                        <button class="quantity-btn quantity-minus" type="button">
                                            <i class="icofont-minus" aria-hidden="true"></i>
                                        </button>
                                    </div>
                                </li>
                                <li>
                                    <a class="cart-btn" id="ai" onclick="cc()">Add to Cart</a>
                                </li>
                            </ul>
                        </div>
                    </div>

                </div>

            </div>
            <div class="single-product-info">
                <ul class="nav nav-tabs" role="tablist">
                    <li class="nav-item">
                        <a class="nav-link active" id="home-tab" data-toggle="tab" href="#description" role="tab" aria-selected="true">Description</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" id="profile-tab" data-toggle="tab" href="#add-info" role="tab" aria-selected="false">Additional Info</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" id="contact-tab" data-toggle="tab" href="#reviews" role="tab" aria-selected="false">Reviews (1)</a>
                    </li>
                </ul>
                <div class="tab-content">
                    <div class="tab-pane fade active show" id="description" role="tabpanel">
                        <div class="product-description">
                            <p>Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui</p>
                            <p>Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas eum iure reprehenderit voluptate.Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid.</p>
                        </div>
                    </div>
                    <div class="tab-pane fade" id="add-info" role="tabpanel">
                        <div class="row">
                            <div class="col-lg-4">
                                <ul class="additional-info">
                                    <li>King Cheesey Pizza TinTIn</li>
                                    <li>Lorem ipsum dolor sit amet</li>
                                    <li>Lorem ipsum dolor sit amet</li>
                                    <li>Lorem ipsum dolor sit amet</li>
                                    <li>Lorem ipsum dolor sit amet</li>
                                </ul>
                            </div>
                            <div class="col-lg-4">
                                <ul class="additional-info">
                                    <li>Lorem ipsum dolor sit amet</li>
                                    <li>Lorem ipsum dolor sit amet</li>
                                    <li>Lorem ipsum dolor sit amet</li>
                                    <li>Lorem ipsum dolor sit amet</li>
                                    <li>Lorem ipsum dolor sit amet</li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <div class="tab-pane fade" id="reviews" role="tabpanel">
                        <div class="product-review">
                            <div class="media">
                                <div class="item-img">
                                    <img src="${pageContext.request.contextPath}/static/media/figure/author_5.jpg" alt="blog">
                                </div>
                                <div class="media-body">
                                    <div class="item-date">July 11, 2020</div>
                                    <div class="author-name">
                                        <h5 class="item-title">Matt Cloey</h5>
                                        <div class="item-rating">
                                            <i class="icofont-star"></i>
                                            <i class="icofont-star"></i>
                                            <i class="icofont-star"></i>
                                            <i class="icofont-star"></i>
                                            <i class="icofont-star"></i>
                                        </div>
                                    </div>
                                    <p>Ahen an unknown printer took a galley of type and scrambled it to
                                        make a type specimen book. It has survived not only five centuries.</p>
                                </div>
                            </div>
                            <div class="media">
                                <div class="item-img">
                                    <img src="${pageContext.request.contextPath}/static/media/figure/author_6.jpg" alt="blog">
                                </div>
                                <div class="media-body">
                                    <div class="item-date">July 11, 2020</div>
                                    <div class="author-name">
                                        <h5 class="item-title">Jessica Willium</h5>
                                        <div class="item-rating">
                                            <i class="icofont-star"></i>
                                            <i class="icofont-star"></i>
                                            <i class="icofont-star"></i>
                                            <i class="icofont-star"></i>
                                            <i class="icofont-star"></i>
                                        </div>
                                    </div>
                                    <p>Ahen an unknown printer took a galley of type and scrambled it to
                                        make a type specimen book. It has survived not only five centuries.</p>
                                </div>
                            </div>
                        </div>
                        <div class="review-form">
                            <h3 class="heading-title">WRITE A REVIEW</h3>
                            <form>
                                <div class="row gutters-15">
                                    <div class="col-lg-4 form-group">
                                        <input type="text" placeholder="Name *" class="form-control" name="name" required>
                                    </div>
                                    <div class="col-lg-4 form-group">
                                        <input type="email" placeholder="E-mail *" class="form-control" name="email" required>
                                    </div>
                                    <div class="col-lg-4 form-group">
                                        <input type="text" placeholder="Subject *" class="form-control" name="subject" required>
                                    </div>
                                    <div class="col-12 form-group">
                                        <textarea class="form-control textarea" placeholder="Comment Here *" name="message" id="message" cols="30" rows="6"></textarea>
                                    </div>
                                    <div class="col-12 form-group">
                                        <input type="submit" class="submit-btn" value="SUBMIT COMMENT">
                                    </div>
                                </div>
                                <div class="form-response"></div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
            <div class="related-product">
                <h3 class="heading-title">Related Products</h3>

                <div class="row tuijian">

                    <%--<c:forEach items="${list}" var="t">--%>
                    <%--<div class="col-lg-4 col-md-6">--%>
                        <%--<div class="block-box product-box">--%>
                            <%--<div class="product-img">--%>
                                <%--<a href="#"><img src="${pageContext.request.contextPath}/static/media/figure/${t.simg}" alt="product"></a>--%>
                            <%--</div>--%>
                            <%--<div class="product-content">--%>
                                <%--<div class="item-category">--%>
                                    <%--<a href="#">${t.sdetails}</a>--%>
                                <%--</div>--%>
                                <%--<h3 class="product-title"><a href="#">${t.stitle}</a></h3>--%>
                                <%--<div class="product-price">$${t.sprice}</div>--%>
                            <%--</div>--%>
                        <%--</div>--%>
                    <%--</div>--%>
                    <%--</c:forEach>--%>
                    <%--<div class="col-lg-4 col-md-6">--%>
                        <%--<div class="block-box product-box">--%>
                            <%--<div class="product-img">--%>
                                <%--<a href="#"><img src="${pageContext.request.contextPath}/static/media/figure/product_9.png" alt="product"></a>--%>
                            <%--</div>--%>
                            <%--<div class="product-content">--%>
                                <%--<div class="item-category">--%>
                                    <%--<a href="#">COFFEE MUGS</a>--%>
                                <%--</div>--%>
                                <%--<h3 class="product-title"><a href="#">Black Coffee Mug</a></h3>--%>
                                <%--<div class="product-price">$29</div>--%>
                            <%--</div>--%>
                        <%--</div>--%>
                    <%--</div>--%>


                </div>

            </div>
        </div>
        <!--=====================================-->
        <!--=        Footer Area Start       	=-->
        <!--=====================================-->
        <footer class="footer-wrap footer-dashboard">
            <div class="main-footer">
                <div class="container">
                    <div class="row row-cols-lg-4 row-cols-sm-2 row-cols-1">
                        <div class="col">
                            <div class="footer-box">
                                <div class="footer-logo">
                                    <a href="${pageContext.request.contextPath}/Directory/index"><img src="${pageContext.request.contextPath}/static/media/logo_dark.png" alt="Logo"></a>
                                </div>
                                <p>Dorem ipsum dolor sit amet consec adipisicing elit sed do eiusmod por incidiut labore et loreLorem ipsum kelly amieo dolorey.</p>
                            </div>
                        </div>
                        <div class="col d-flex justify-content-lg-center">
                            <div class="footer-box">
                                <h3 class="footer-title">
                                    Important Links
                                </h3>
                                <div class="footer-link">
                                    <ul>
                                        <li><a href="${pageContext.request.contextPath}/Directory/index">Home</a></li>
                                        <li><a href="${pageContext.request.contextPath}/Directory/about-us">About us</a></li>
                                        <li><a href="${pageContext.request.contextPath}/Directory/shop">Shop</a></li>
                                        <li><a href="${pageContext.request.contextPath}/Directory/contact">Contacts</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="col d-flex justify-content-lg-center">
                            <div class="footer-box">
                                <h3 class="footer-title">
                                    Community
                                </h3>
                                <div class="footer-link">
                                    <ul>
                                        <li><a href="${pageContext.request.contextPath}/Directory/newsfeed">NewsFeed</a></li>
                                        <li><a href="${pageContext.request.contextPath}/Directory/user-timeline">Profile</a></li>
                                        <li><a href="${pageContext.request.contextPath}/Directory/user-friends">Friends</a></li>
                                        <li><a href="${pageContext.request.contextPath}/Directory/user-groups">Groups</a></li>
                                        <li><a href="${pageContext.request.contextPath}/Directory/forums">Forums</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="col d-flex justify-content-lg-center">
                            <div class="footer-box">
                                <h3 class="footer-title">
                                    Followers
                                </h3>
                                <div class="footer-link">
                                    <ul>
                                        <li><a href="https://www.facebook.com/">facebook</a></li>
                                        <li><a href="https://twitter.com/">twitter</a></li>
                                        <li><a href="https://www.instagram.com/">instagram</a></li>
                                        <li><a href="https://www.youtube.com/">Youtube</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="footer-bottom">
                <div class="footer-copyright">Copy© cirkle 2021. All Rights By <a href="http://www.bootstrapmb.com/">bootstrapmb</a></div>
            </div>
        </footer>



    </div>
    <!-- Chat Modal Here -->
    <div class="chat-conversion-box" id="chat-box-modal" tabindex="-1" aria-labelledby="chat-modal-label" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h6 class="modal-title" id="chat-modal-label">Fahim Rahman <span class="online"></span></h6>
                    <div class="action-icon">
                        <button class="chat-shrink"><i class="icofont-minus"></i></button>
                        <button type="button" class="close chat-close chat-open" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                </div>
                <div class="modal-body">
                    <ul class="chat-conversion">
                        <li class="chat-others">
                            <div class="author-img">
                                <img src="${pageContext.request.contextPath}/static/media/figure/chat_12.jpg" alt="Chat">
                            </div>
                            <div class="author-text">
                                <span>How are you Fahim vai ? Tommorow office will be your last day of Bachelor life.</span>
                            </div>
                        </li>
                        <li class="chat-you">
                            <div class="author-img">
                                <img src="${pageContext.request.contextPath}/static/media/figure/chat_11.jpg" alt="Chat">
                            </div>
                            <div class="author-text">
                                <span>hmm That's great</span>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="modal-footer">
                    <form>
                        <div class="form-group">
                            <input type="text" class="form-control" placeholder="Write your text here.....">
                            <div class="chat-plus-icon"><i class="icofont-plus-circle"></i></div>
                            <div class="file-attach-icon">
                                <a href="#"><i class="icofont-slightly-smile"></i></a>
                                <a href="#"><i class="icofont-camera"></i></a>
                                <a href="#"><i class="icofont-image"></i></a>
                                <a href="#"><i class="icofont-mic"></i></a>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
</form>
<!-- Jquery Js -->
<script src="${pageContext.request.contextPath}/static/dependencies/jquery/js/jquery.min.js"></script>
<script src="${pageContext.request.contextPath}/static/dependencies/popper.js/js/popper.min.js"></script>
<script src="${pageContext.request.contextPath}/static/dependencies/bootstrap/js/bootstrap.min.js"></script>
<script src="${pageContext.request.contextPath}/static/dependencies/imagesloaded/js/imagesloaded.pkgd.min.js"></script>
<script src="${pageContext.request.contextPath}/static/dependencies/isotope-layout/js/isotope.pkgd.min.js"></script>
<script src="${pageContext.request.contextPath}/static/dependencies/slick-carousel/js/slick.min.js"></script>
<script src="${pageContext.request.contextPath}/static/dependencies/sal.js/sal.js"></script>
<script src="${pageContext.request.contextPath}/static/dependencies/magnific-popup/js/jquery.magnific-popup.min.js"></script>
<script src="${pageContext.request.contextPath}/static/dependencies/mcustomscrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
<script src="${pageContext.request.contextPath}/static/dependencies/select2/js/select2.min.js"></script>
<script src="${pageContext.request.contextPath}/static/dependencies/elevate-zoom/jquery.elevatezoom.js"></script>
<script src="${pageContext.request.contextPath}/static/dependencies/bootstrap-validator/js/validator.min.js"></script>
<script src="http://www.google.cn/maps/api/js?key=AIzaSyBtmXSwv4YmAKtcZyyad9W7D4AC08z0Rb4"></script>
<script>
    function tj() {
        $.ajax({
            "url":"${pageContext.request.contextPath}/SuiJTuiJ",
            "Type":"GET",
            "dataType":"JSON",
            "success":function (data) {

                var str="";
                $(data).each(function () {

                    str+="<div class='col-lg-4 col-md-6'>";
                    str+="<div class='block-box product-box'>";
                    str+="<div class='product-img'>";
                    str+="<a href='${pageContext.request.contextPath}/singleshop?sid="+this.sid+"'><img src='${pageContext.request.contextPath}/static/img/"+this.simg+"' alt='product'></a>";
                    str+="</div>";
                    str+="<div class='product-content'>";
                    str+="<div class='item-category'>";
                    str+="<a href='#'>"+this.sdetails+"</a>";
                    str+="</div>";
                    str+="<h3 class='product-title'><a href='#'>"+this.stitle+"</a></h3>";
                    str+="<div class='product-price'>$"+this.sprice+"</div>";
                    str+="</div>";
                    str+="</div>";
                    str+="</div>";
                });
                $(".tuijian").append(str);
            }
        })
    }
    tj();
    // function shua() {
    //     $(".shuax").remove();
    //     tj();
    // }
</script>
<!-- Site Scripts -->
<script src="${pageContext.request.contextPath}/static/assets/js/app.js"></script>
<script>

    function cc() {
        var aa=$("#pnum").val();
        location.href="${pageContext.request.contextPath}/addGouWu?sid=${s.sid}&pnum="+aa;
    }

</script>
</body>

</html>
